<template>
	<view class="searchScan">
		<u-search
			ref="uSelect"
			:show-action="false"
			actionText="录入"
			bgColor="#fff"
			borderColor="#f2f2f2"
			:focus="focus"
			:animation="false"
			:placeholder="placeholder"
			:search-icon="searchIcon"
			height="34px"
			shape="square"
			clearabled
			v-model="scanCode"
			@clickIcon="scanHandle"
			@custom="searchHandle"
			@search="searchHandle"
			@clear="clearHandle"></u-search>
	</view>
</template>

<script setup name="ScanBarH5">
/**
 * ScanBar 扫码组件
 * @description 手动录入、自动扫码
 * @property {Array} scanType 扫码类型
 * @property {Boolean} reset = [true | false] 初始化扫码组件
 * @event {Function} code-scanned 扫码成功事件
 * @event {Function} update:reset 同步reset事件
 * @example <scan-bar @code-scanned="getScanResult" v-model:reset="scanReset"></scan-bar>
 */
import { onShow } from "@dcloudio/uni-app";
import { nextTick, onMounted, ref, watch } from "vue";
import { toScanCode } from "@/components/hs-scancode/scan.js";

const emit = defineEmits(["code-scanned"]);

const props = defineProps({
	scanType: {
		type: Array,
		default: () => ["barCode", "qrCode", "datamatrix", "pdf417"],
	},
	placeholder: {
		type: String,
		default: "请扫描条形码",
	},
	searchIcon: {
		type: String,
		default: "scan",
	},
});

const { scanType, placeholder, searchIcon } = toRefs(props);

const focus = ref(false);

const uSelect = ref();

onShow(() => {
	reset();
});

function reset() {
	focus.value = false;
	$hideKeyboard();
	setTimeout(() => {
		scanCode.value = "";
		focus.value = true;
	}, 200);
}
const foucsIndex = ref(0);
function toFoucs(to, hideKeyboard = true, callback) {
	foucsIndex.value = 9999;
	nextTick(() => {
		foucsIndex.value = to;
		hideKeyboard ? $hideKeyboard() : "";
		callback ? callback() : "";
	});
}
// 关闭软键盘,防冻
function $hideKeyboard() {
	const interval = setInterval(function () {
		uni.hideKeyboard(); //隐藏软键盘
	}, 10);
	setTimeout(() => {
		clearInterval(interval);
		console.log("停止刷新");
	}, 2000);
}

function scanBlurHandle() {
	// 光标value重置
	// focus.value = false;
}
function hideKeyboard() {
	uni.hideKeyboard();
}

const scanCode = ref("");

async function scanHandle() {
	await toScanCode({
		onlyFromCamera: true, // 只允许通过相机扫码
	})
		.then(async (res) => {
			// searchText.value = res;
			// searchList();
			scanCode.value = res;
			uni.showToast({
				icon: "success",
				title: `扫码成功`,
			});
			console.log("条码类型：" + res);
			console.log("条码内容：" + res);
			await emit("code-scanned", scanCode.value);
			uni.showToast({
				icon: "success",
				title: `扫码成功${scanCode.value}`,
			});
		})
		.catch((e) => {
			uni.showToast({
				icon: "error",
				title: e,
			});
		})
		.finally(() => {
			focus.value = true;
		});
}

function clearHandle() {
	scanCode.value = "";
	emit("code-scanned", scanCode.value);
}

function searchHandle() {
	if (!scanCode.value) {
		uni.showToast({
			icon: "error",
			title: "请录入码",
		});
	} else {
		emit("code-scanned", scanCode.value);
	}
}

defineExpose({
	scanCode,
	reset,
});
</script>

<style lang="scss" scoped>
:deep(.uni-input-wrapper) {
	align-items: center;
}
:deep(.u-search__content__input--placeholder) {
	// margin-top: 1px;
	line-height: 28px;
	font-size: 15px;
}
</style>
